/**
 * Created by Administrator on 2017/3/10.
 */
import React from 'react';
import ReactDom from 'react-dom';
const logoSrc="" +
    "images/web-logo.png";
const NavList=[
    {
        name:"网站首页"
    },
    {
        name:"学校概况",
        href:"#",
        list:[
            {
                name:"学校简介",
                href:"#"
            },
            {
                name:"历史沿革",
                href:"#"
            }
        ]
    },
    {
        name:"招生信息",
        href:"#",
        list:[
            {
                name:"公告通知",
                href:"#"
            },
            {
                name:"招生政策",
                href:"#"
            },
            {
                name:"考试大纲",
                href:"#"
            },
            {
                name:"历年分数线",
                href:"#"
            }


        ]
    },
    {
        name:"招生简章",
        list:[
            {
                name:"硕士招生",
                href:"#"
            },
            {
                name:"博士招生",
                href:"#"
            },
            {
                name:"港澳台招生",
                href:"#"
            }
        ]
    },
    {
        name:"网上报名",
        list:[
            {
                name:"推免生网报系统",
                href:"#"
            },
            {
                name:"硕士/博士网上报名系统",
                href:"#"
            },
            {
                name:"硕士/博士网上确认系统",
                href:"#"
            },
            {
                name:"硕士/博士成绩查询系统",
                href:"#"
            },
            {
                name:"夏令营网上报名系统",
                href:"#"
            }
        ]
    },
    {
        name:"资源下载",
        href:"#"
    },
    {
        name:"联系我们",
        href:"#",
        list:[
            {
                name:"招生咨询及申述渠道",
                href:"#"
            },
            {
                name:"院系联系方式",
                href:"#"
            },
            {
                name:"常见问题",
                href:"#"
            },
            {
                name:"留言板",
                href:"#"
            },
            {
                name:"问卷调查",
                href:"#"
            }
        ]
    },

];
class Logo extends React.Component{
    render() {
        return(
            <div className="logo">
                <img alt="logo" src={logoSrc}/>
            </div>
        )
    }
}
class Right extends React.Component{
    render() {
        return(
            <div className="topR">
                <a href="#">设置首页</a>|
                <a href="#">加入收藏</a>
            </div>
        )
    }
}
class Top extends React.Component{
    render() {
        return(
            <div className="top">
                <Logo/>
                <Right/>
            </div>
        )
    }
}

class Nav extends React.Component{
    render() {
        return(
            <div className="navContainer">
                <nav>
                    <ul className="nav">
                        {
                            NavList.map(function (nav,idx) {
                                return(
                                    <li className="link"  key={"link1"+idx}>
                                        <a href={nav.href}>{nav.name}</a>
                                        {(() => {
                                            if(nav.list){
                                                return(
                                                    <ul className="sub">
                                                        {
                                                            nav.list.map(function (subItem,idx) {
                                                                return(
                                                                    <li  key={"nav"+idx}><a href={subItem.href}>{subItem.name}</a> </li>
                                                                )
                                                            })
                                                        }
                                                    </ul>
                                                )
                                            }
                                        })()}
                                    </li>
                                )
                            })
                        }
                    </ul>
                </nav>
            </div>
        )
    }
}
export  default class Header extends React.Component {
    render(){
        return(
            <header className="clerrfix">
                <Top/>
                <Nav/>
            </header>
        )
    }
}



